<%@ page import="com.example.entity.UserInfo" %><%--
  Created by IntelliJ IDEA.
  User: 20154
  Date: 2024/12/3
  Time: 9:25
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--进入此页面用户必须登录--%>
<%--鉴权操作--%>
<%
    UserInfo userInfo=(UserInfo) session.getAttribute("userInfo");
    if (userInfo==null) {
        response.sendRedirect(request.getContextPath()+"/index.jsp");//鉴权失败  返回登录
    }
%>

<html>
<head>
    <title>智慧校园教务信息管理系统</title>
    <%--引入ui框架--%>
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.8.6/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.8.6/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="jquery-easyui-1.8.6/demo/demo.css">
    <script type="text/javascript" src="jquery-easyui-1.8.6/jquery.min.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.8.6/jquery.easyui.min.js"></script>
    <script type="text/javascript" src="jquery-easyui-1.8.6/locale/easyui-lang-zh_CN.js"></script>
</head>
<body class="easyui-layout">
<%--顶部--%>
<div region="north" style="height: 80px;background-color: #99cdff;border-radius: 5px">
    <div style="float: left;width: 500px;padding-left: 20px">
        <h1>教务信息管理系统</h1>
    </div>
    <div style="float: right;padding-top: 50px;padding-right: 20px">
        <span style="color: blue">当前用户：<%= userInfo.getUserName()%></span>
    </div>
</div>
<%--页面主体部分--%>
<div region="center">
    <%--标签栏--%>
    <div id="tabs" class="easyui-tabs" fit="true" border="false">
        <div title="首页">
            <div align="center" style="padding-top: 100px">
                <span style="font-size: 60px;color: red">
                    欢迎使用教务系统
                </span>
            </div>
        </div>
    </div>
</div>
<%--侧边栏--%>
<div region="west" style="width: 200px;border-radius: 5px" title="导航菜单" split="true">
        <ul id="tree">

        </ul>
</div>
<%--底部版权信息栏--%>
<div region="south" style="height: 25px" align="center">
    版权所有@九江学院
</div>
</body>
<%--编写JS脚本代码 初始化菜单栏--%>
<script>
    $(function (){
        //1、初始化菜单
        let treeData=[
            {
                text: '菜单栏',
                children:[
                    {
                        text: '班级信息管理',
                        attributes: {
                            url:'<%=request.getContextPath()%>'+'/ClassInfoManager.jsp'
                        }
                    },
                    {
                        text: '学生信息管理'
                    }
                ]
            }
        ]
        //2、树化菜单
        $('#tree').tree({
            //树的数据源
            data: treeData,
            //树行级显示
            lines:true,
            //点击事件
            onClick: function(node){
                //菜单栏点击事件后 主动切换标签页
                openTab(node.text,node.attributes.url);
            }
        })
        //3、菜单与主体页面部分联动
        //3.1、菜单栏的切换与主体页面内容的更换
        /*
        * @param text 菜单栏名称
        * @param url 切换到哪个功能页面
        * */
        function openTab(text, url) {
            //判断该功能页面是否存在
            if (!$('#tabs').tabs('exists', text)) {
                //如果不存在，添加到tabs中
                //标签页替换的内容，实际地址需要通过iframe内签到标签页内
                content="<iframe " +
                    "frameborder='0' " +
                    "scrolling='auto' " +
                    "style='width:100%;height:86vh' " +
                    "src="+url+"></iframe>";
                $('#tabs').tabs('add', {
                    title: text,
                    closable: true,//标签可关闭
                    content: content
                });
            } else {
                //如果存在，切换到该功能页面
                $('#tabs').tabs('select', text);
            }
        }
    })


</script>
</html>
